<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>大风车</title>
		<script src="js/jquery-1.11.1.js"></script>
		<style>
			img{
			
				animation:dfc .8s linear infinite;
			}
			/* 关键帧 */
			@keyframes dfc{
				0%{
					transform:translate(20px) rotate(180deg) ;
				}
				30%{
					transform:translate(230px)   rotate(360deg) ;
				}
				100%{
					transform: translate(120px)   rotate(720deg) ;
				}
			}
		</style>
	</head>
	<body>
		<img src="img/透明背景-二次元_舞蹈2_爱给网_aigei_com.gif" alt="" />
		<audio src="" autoplay></audio>
		<button id="btn1">开转</button>
		<button id="btn2">暂停</button>
		<button id="btn3">反转</button>
		<script>
			//点击开转   图片切换并且添加样式
			$("#btn1") .click(function(){
				$("img").attr("src","../FIG 图片_爱给网_aigei_com.gif ").addClass("imga");
			});
		</script>
	</body>
</html>